export function lineChartFun(data, chartsId) {
  let lineAreaCharts = echarts.init(document.getElementById(chartsId));
  let seriesData = (data.yData || []).map((item, index) => {
    return {
      name: item.name || '',
      type: 'line',
      symbolSize: 6,
      symbol: 'circle',
      smooth: true,
      data: item.value || [],
    };
  });
  let lineAreaChartsOption = {
    tooltip: {
      trigger: "axis",
    },
    grid: {
      left: '2%',
      right: '2%',
      bottom: '6%',
      top: '17%',
      containLabel: true,
    },
    //图例
    legend: {
      show: data.legendShow === false ? data.legendShow : true,
      left: data.legendLeft ? data.legendLeft : '14%',
      textStyle: {
          fontSize: 14,
          color: "#333",
      },
      itemWidth: 16,
      itemHeight: 10,
      itemGap: 42,
    },
    xAxis: {
      type: 'category',
      data: data.xData,
      axisLine: {
        show: true,
        lineStyle: {
          color: '#E9EFF4',
          width: 1,
        },
      },
      axisTick: {
        show: false,
      },
      axisLabel: {
        show: true,
        textStyle: {
          color: '#666666', //X轴文字颜色
          fontSize: 12
        },
      },
    },
    yAxis: {
      type: "value",
      name: data.yData[0].unit,
      splitLine: {
        show: true,
        lineStyle: {
          type: "dotted",
          color: "#E9EFF4",
          type: [6, 3],
          dashOffset: 2,
        },
      },
      axisLabel: {
        padding: [0, 5, 0, 0],
        fontSize: 12,
        textStyle: {
          color: "#666666",
          fontFamily: "Microsoft YaHei",
        },
      },
    },
    series: seriesData,
  };
  lineAreaCharts.setOption(lineAreaChartsOption, true);
}
